

.sphere_box {
    transform-style: preserve-3d;
    height: 100%;
    transform: rotateX(70deg) rotateY(-20deg);
}

.star {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 300px;
    height: 300px;
    transform-style: preserve-3d;
    /*border: 1px solid #fff;*/
    animation: starrotate 15s linear;
    animation-iteration-count: infinite;
}

.starline {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    border: 1px solid #204869;
    border-radius: 50%;
}

.starline:nth-child(1) {
    transform: rotateY(10deg);
}

.starline:nth-child(2) {
    transform: rotateY(20deg);
}

.starline:nth-child(3) {
    transform: rotateY(30deg);
}

.starline:nth-child(4) {
    transform: rotateY(40deg);
}

.starline:nth-child(5) {
    transform: rotateY(500deg);
}

.starline:nth-child(6) {
    transform: rotateY(60deg);
}

.starline:nth-child(7) {
    transform: rotateY(70deg);
}

.starline:nth-child(8) {
    transform: rotateY(80deg);
}

.starline:nth-child(9) {
    transform: rotateY(90deg);
}

.starline:nth-child(10) {
    transform: rotateY(100deg);
}

.starline:nth-child(11) {
    transform: rotateY(110deg);
}

.starline:nth-child(12) {
    transform: rotateY(120deg);
}

.starline:nth-child(13) {
    transform: rotateY(130deg);
}

.starline:nth-child(14) {
    transform: rotateY(140deg);
}

.starline:nth-child(15) {
    transform: rotateY(150deg);
}

.starline:nth-child(16) {
    transform: rotateY(160deg);
}

.starline:nth-child(17) {
    transform: rotateY(170deg);
}

.starline:nth-child(18) {
    transform: rotateY(180deg);
}

.starline:nth-child(19) {
    transform: rotateX(10deg);
}

.starline:nth-child(20) {
    transform: rotateX(20deg);
}

.starline:nth-child(21) {
    transform: rotateX(30deg);
}

.starline:nth-child(22) {
    transform: rotateX(40deg);
}

.starline:nth-child(23) {
    transform: rotateX(50deg);
}

.starline:nth-child(24) {
    transform: rotateX(60deg);
}

.starline:nth-child(25) {
    transform: rotateX(70deg);
}

.starline:nth-child(26) {
    transform: rotateX(80deg);
}

.starline:nth-child(27) {
    transform: rotateX(90deg);
}

.starline:nth-child(28) {
    transform: rotateX(100deg);
}

.starline:nth-child(29) {
    transform: rotateX(110deg);
}

.starline:nth-child(30) {
    transform: rotateX(120deg);
}

.starline:nth-child(31) {
    transform: rotateX(130deg);
}

.starline:nth-child(32) {
    transform: rotateX(140deg);
}

.starline:nth-child(33) {
    transform: rotateX(150deg);
}

.starline:nth-child(34) {
    transform: rotateX(160deg);
}

.starline:nth-child(35) {
    transform: rotateX(170deg);
}

.starline:nth-child(36) {
    transform: rotateX(180deg);
}

@keyframes starrotate {
    from {
        transform: rotateZ(0deg);
    }

    to {
        transform: rotateZ(360deg);
    }
}